{% extends "personal_center/base.html" %}

{% block page_link %}
    <link rel="stylesheet" href="../../static/system_setup/css/style.css">
{% endblock %}


{% block style %}
    <style>
        .add_class {
            background: #1E90FF;
        }

        tr {
            height: 35px;
        }

        th {
            text-align: center;
        }

        #yishou_table tr:hover{
            background: #cfcfcf;
        }

        tbody td{
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        td:first-child, th:first-child {
            position: sticky;
            left: 0; /* 首行永远固定在左侧 */
            z-index: 1;
        }

        thead tr th {
            position: sticky;
            top: 0; /* 列首永远固定在头部  */
            background-color: #E8E8E8;
        }

        th:first-child {
            z-index: 2;
        }
    </style>
{% endblock %}


{% block right_content %}
    <div class="headline">
        <div class="tab_top_right" style="text-align: right;padding-right: 15px;">
            <form role="search" method="get" id="searchform" action="./record_management.html" style="font-size: 0;margin-top: 5px;">
                <input type="search" name="search_value" placeholder="搜索" value="{{ search_value }}" style="font-size: 14px;height: 30px;border: #00a0e9 solid 1px;border-top-left-radius: 4px;border-bottom-left-radius: 4px;vertical-align: top;width: 250px;">
                <button type="submit" style="font-size: 14px;height: 30px;border: #00a0e9 solid 1px;border-top-right-radius: 4px;border-bottom-right-radius: 4px;border-left: none;background: #00a0e9;color: white;line-height: 30px;vertical-align: top;width: 80px;"><span class="ion-ios-search-strong"> 搜索</span></button>
            </form>
        </div>
    </div>

    <div id="my_application" style="width: 100%;height: 94.5%;overflow: auto;background-color: white;">
        <div class="right-box" style="width: 100%;height: 100%;margin-top: 0;">
            <div style="height: 93%;width: 100%;overflow: auto;border-bottom: #cccccc solid 1px;background-color: white;">
                <table id="yishou_table" style="border-collapse: collapse;border-color: #DCDCDC;" cellspacing="0" cellpadding="2" width="100%" border="1">
                    <thead>
                    <tr>
                        <th style="width: 200px;">公文类型</th>
                        <th style="width: 400px;">公文标题</th>
                        <th>公文编号</th>
                        <th>拟稿人</th>
                        <th>拟稿科室</th>
                        <th>收文时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody style="overflow: auto;" id="my_finished_body">
                        {% for obj in q1 %}
                            <tr>
                                {% if obj.real_name %}
                                    {% if obj.notice_id.type == 'a' %}
                                        <td style="text-align: center;">党委会议纪要</td>
                                    {% elif obj.notice_id.type == 'b' %}
                                        <td style="text-align: center;">院长办公会会议纪要</td>
                                    {% elif obj.notice_id.type == 'c' %}
                                        <td style="text-align: center;">党委专题会议纪要</td>
                                    {% elif obj.notice_id.type == 'd' %}
                                        <td style="text-align: center;">院长办公会专题会议纪要</td>
                                    {% elif obj.notice_id.type == 'e' %}
                                        <td style="text-align: center;">行政例会简报</td>
                                    {% elif obj.notice_id.type == 'f' %}
                                        <td style="text-align: center;">行政公文</td>
                                    {% elif obj.notice_id.type == 'g' %}
                                        <td style="text-align: center;">党委公文</td>
                                    {% else %}
                                        <td style="text-align: center;">行政公文</td>
                                    {% endif %}
                                    <td style="padding-left: 5px;">{{ obj.notice_id.conference_memo_text }}</td>
                                    <td style="padding-left: 5px;">{{ obj.notice_id.document_number}}</td>
                                    <td style="text-align: center;">{{ obj.notice_id.drafter}}</td>
                                    <td style="text-align: center;">{{ obj.notice_id.drafter_company }}</td>
                                    <td style="text-align: center;">{{ obj.update_time | date:"Y-m-d H:i" }}</td>
                                    <td style="text-align: center;"><a href='document_detail.html?attention=1&id={{ obj.notice_id.id }}'>查看</a></td>
                                {% else %}
                                    <td style="text-align: center;">上级来文</td>
                                    <td style="padding-left: 5px;">{{ obj.notice_id.title }}</td>
                                    <td style="padding-left: 5px;">{{ obj.notice_id.recive_number}}</td>
                                    <td style="text-align: center;">{{ obj.notice_id.apply_user.real_name}}</td>
                                    <td style="text-align: center;">{{ obj.notice_id.apply_user.department }}</td>
                                    <td style="text-align: center;">{{ obj.update_time | date:"Y-m-d H:i" }}</td>
                                    <td style="text-align: center;"><a href='examinationDetail.html?id={{ obj.notice_id.id }}'>查看</a></td>
                                {% endif %}
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
                <div id="img-display1" style="width: 75%;text-align: center;position: fixed;display: none;">
                    <div style="margin-top: 10%;">
                        <img src="../../static/public_file/images/page-img/11.jpg" alt="">
                        <p style="margin: 0;padding: 0;vertical-align: top;">暂无数据</p>
                    </div>
                </div>
            </div>

            <nav style="background: none;padding-top: 0.5%;" aria-label="Page navigation example">
                <div style="display: inline-block;margin-left: 2%;">
                    <ul class="pagination">
                        <li class="page-item "><a class="page-link" style="width: 40px;height: 30px;line-height: 30px;text-align: center;border-top-left-radius: 4px;border-bottom-left-radius: 4px;" href="./record_management.html?page=1&search_value={{ search_value }}" rel="external nofollow"  rel="external nofollow" >首页</a></li>
                        {% if q1.has_previous %}
                        <li class="page-item"><a class="page-link" style="width: 60px;height: 30px;line-height: 30px;text-align: center;" href="./record_management.html?page={{ q1.previous_page_number }}&search_value={{ search_value }}" rel="external nofollow"  rel="external nofollow" >上一页</a></li>
                        {% else %}
                        <li class="page-item disabled"><a class="page-link" style="width: 60px;height: 30px;line-height: 30px;text-align: center;" href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >上一页</a></li>
                        {% endif %}

                        {% for item in page_range %}
                            {% if item == currentPage %}
                            <li class="page-item active"><a class="page-link" style="width: 40px;height: 30px;line-height: 30px;text-align: center;" href="./record_management.html?page={{ item }}&search_value={{ search_value }}" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >{{ item }}</a></li>
                            {% else %}
                            <li class="page-item"><a class="page-link" style="width: 40px;height: 30px;line-height: 30px;text-align: center;" href="./record_management.html?page={{ item }}&search_value={{ search_value }}" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >{{ item }}</a></li>
                            {% endif %}
                        {% endfor %}

                        {% if q1.has_next %}
                        <li class="page-item"><a class="page-link" style="width: 60px;height: 30px;line-height: 30px;text-align: center;" href="./record_management.html?page={{ q1.next_page_number }}&search_value={{ search_value }}" rel="external nofollow"  rel="external nofollow" >下一页</a></li>
                        {% else %}
                        <li class="page-item disabled"><a class="page-link" style="width: 60px;height: 30px;line-height: 30px;text-align: center;" href="#" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  rel="external nofollow" >下一页</a></li>
                        {% endif %}
                        <li class="page-item" style="border-left: none;"><a class="page-link" style="width: 40px;height: 30px;line-height: 30px;text-align: center;border-top-right-radius: 4px;border-bottom-right-radius: 4px;" href="./record_management.html?page={{ paginator.num_pages }}&search_value={{ search_value }}" rel="external nofollow"  rel="external nofollow" >尾页</a></li>
                    </ul>
                </div>
                <div style="display: inline-block;margin-left: 1%;">共 {{ paginator.count }} 条数据</div>
            </nav>

        </div>
    </div>

{% endblock %}

{% block script %}
    <script>
        window.onload = function () {
            document.getElementById("loading").style.display = "none";
            document.getElementById("personage").className = "add_class";
            document.getElementById("record_main").className = "add-nav-active";
        };

        var tTD_wei; //用来存储当前更改宽度的Table Cell,避免快速移动鼠标的问题
        var table_tb_wei = document.getElementById("yishou_table");
        for (j = 0; j < table_tb_wei.rows[0].cells.length; j++) {
            table_tb_wei.rows[0].cells[j].onmousedown = function () {
                //记录单元格
                tTD_wei = this;
                if (event.offsetX > tTD_wei.offsetWidth - 10) {
                    tTD_wei.mouseDown = true;
                    tTD_wei.oldX = event.x;
                    tTD_wei.oldWidth = tTD_wei.offsetWidth;
                }
            };
            table_tb_wei.rows[0].cells[j].onmouseup = function () {
                //结束宽度调整
                if (tTD_wei === undefined) tTD_wei = this;
                tTD_wei.mouseDown = false;
                tTD_wei.style.cursor = 'default';
            };
            table_tb_wei.rows[0].cells[j].onmousemove = function () {
                //更改鼠标样式
                if (event.offsetX > this.offsetWidth - 10)
                    this.style.cursor = 'col-resize';
                else
                    this.style.cursor = 'default';
                //取出暂存的table_tb_wei Cell
                if (tTD_wei === undefined) tTD_wei = this;
                //调整宽度
                if (tTD_wei.mouseDown != null && tTD_wei.mouseDown === true) {
                    tTD_wei.style.cursor = 'default';
                    if (tTD_wei.oldWidth + (event.x - tTD_wei.oldX) > 0)
                        tTD_wei.width = tTD_wei.oldWidth + (event.x - tTD_wei.oldX);
                    //调整列宽
                    tTD_wei.style.width = tTD_wei.width;
                    tTD_wei.style.cursor = 'col-resize';
                    //调整该列中的每个Cell
                    table_tb_wei = tTD_wei;
                    while (table_tb_wei.tagName !== 'TABLE') table_tb_wei = table_tb_wei.parentElement;
                    for (j = 0; j < table_tb_wei.rows.length; j++) {
                        table_tb_wei.rows[j].cells[tTD_wei.cellIndex].width = tTD_wei.width;
                    }
                }
            };
        }
    </script>
{% endblock %}
